import 'package:boss/models/role.dart';

import 'package:boss/ui/page/role/page/roleDetail/role_detail_page.dart';
import 'package:boss/ui/page/role/provider/role_provider.dart';
import 'package:boss/ui/widget/button/fixed_bottom_btn.dart';
import 'package:boss/ui/widget/center_title_app_bar.dart';
import 'package:boss/ui/widget/loader/loader.dart';
import 'package:boss/ui/widget/title_row_button.dart';
import 'package:hi_common/hi_common.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:router/annotation.dart';

@RouterConfig(RolePage.pageName)
class RolePage extends StatefulWidget {
  static const String pageName = '/rolePage';

  @override
  _RolePageState createState() => _RolePageState('角色管理');
}

class _RolePageState extends BaseState<RolePage> {
  _RolePageState(String pageName) : super(pageName);

  @override
  Widget build(BuildContext ctx) {
    return Scaffold(
      appBar: CenterTitleAppBar(title: '角色管理'),
      body: Column(
        children: <Widget>[
          Expanded(
            child: Loader<List<Role>>(
              loadTask: Provider.of<RoleProvider>(context).initData,
              builder: (context) => Consumer<RoleProvider>(
                builder: (context, provider, _) {
                  return ListView.builder(
                    padding: EdgeInsets.symmetric(horizontal: 30.w),
                    itemBuilder: (context, index) => TitleRowButton(
                      title: '${provider.roles[index].roleName}',
                      hintText: '',
                      value: '',
                      onTap: () {
                        _toDetailPage(role: provider.roles[index]);
                      },
                    ),
                    itemCount: provider.roles.length,
                  );
                },
              ),
            ),
          ),
          FixedBottomBtn(title: '新增角色', onTap: _toDetailPage),
        ],
      ),
    );
  }

  _toDetailPage({Role role}) {
    Navigator.pushNamed(context, RoleDetailPage.pageName, arguments: {'role': role});
  }
}
